﻿@model WeChatParking.Entity.CarRecord
@{
    ViewBag.Title = "缴费";
    var PayFee = ViewBag.PayFee;
    string PayApiKey = string.IsNullOrWhiteSpace(ViewBag.PayApiKey) ? "" : ViewBag.PayApiKey;
    var list = ViewBag.list;
}
<div class="page" id="page-prepaid">
    <header class="bar bar-nav">
        <h1 class="title">缴费</h1>
    </header>
    <div class="content">
        <form id="form-prepaid">
            <div class="list-block">
                <div class="banner">
                    <img id="Inimg" src="@Html.Raw(string.IsNullOrWhiteSpace(Model.Inimg) ? "/Res/img/nopic.gif" : Model.Inimg)" style="width: 100%; height: 230px;margin-top:-30px;" />
                    <input type="hidden" id="carReID" name="carReID" value="@Model.id">
                    <input type="hidden" id="PayApiKey" value="@PayApiKey">
                    <input type="hidden" id="Guid" value="@Model.Guid">
                </div>
                <ul>

                    <!-- Text inputs -->
                    <li>
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title label">车牌号码：</div>
                                <div class="item-input">
                                    <input type="text" id="carBrand" name="carBrand" placeholder="暂无入场信息" readonly="value" value="@Model.carBrand">
                                    @*  <select name="Car_Plate" id="Car_Plate">
                                       @foreach (var item in list)
                                       {
                                            <option value="@item.ID">@item.Car_plate</option>
                                       }
                                   
                                </select>*@
                                </div>
                                @if (PayApiKey == "")
                                {
                                    <a href="#" class="button button-fill open-panel" id='panel-js-demo'>选择车牌</a>
                                }

                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title label">停&nbsp;车&nbsp;场&nbsp;：</div>
                                <div class="item-input">
                                    <input type="text" id="Enterprise_Name" name="Enterprise_Name" placeholder="暂无入场信息" readonly="value" value="@Model.Enterprise_Name">
                                </div>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title label">入场时间：</div>
                                <div class="item-input">
                                    <input type="text" id="inTime" name="inTime" placeholder="暂无入场信息" readonly="value" value="@Model.inTime
">
                                </div>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title label">停&nbsp;车&nbsp;费&nbsp;：</div>
                                <div class="item-input">
                                    <input type="text" name="payval" id="payval" value="@PayFee" style="color: red;" readonly="value">
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="content-block">
                <p>
                    <button id="submit-prepaid" class="button button-fill button-big">缴费</button>
                </p>
            </div>
        </form>
        <div class="copyright">
            <p>厦门一指通智能科技有限公司 </p>
            <p>©2018 www.xmyzt.com.cn</p>
        </div>
    </div>
</div>
<div class="panel panel-right panel-cover theme-dark" id='panel-right-demo'>
    <div class="content-block">
        <p>选择车牌</p>

        @foreach (var item in list)
        {
            <p><a class="button button-big" onclick="ChooseCar('@item.Car_plate')">@item.Car_plate </a></p>
        }
        <p></p>
        <!-- Click on link with "close-panel" class will close panel -->
        <p><a href="#" class="close-panel">关闭</a></p>
    </div>
</div>


<script>
    $(document).on("click", ".my-btn", function () {
        $.openPanel("#panel-right-demo");
    });
    function ChooseCar(val) {
        common.postAjax('/H5/ChooseCar', { ChePai: val }, function (result) {
            if (result) {
                var car = $.parseJSON(result)
                document.getElementById("Inimg").src = car.Inimg;
                document.getElementById("carReID").value = car.id;
                document.getElementById("Guid").value = car.Guid;
                document.getElementById("carBrand").value = car.carBrand;
                document.getElementById("Enterprise_Name").value = car.Enterprise_Name;
                document.getElementById("inTime").value = car.inTime.replace('T',' ');
                document.getElementById("payval").value = car.Y_fee;
                //alert(result);
            } else {
                $.toast('无进场记录');
            }
        });
        $.closePanel()
    }

    $(document).ready(function () {
        window.setInterval("reloadData()", 1 * 1000);
    });
    var reloadData = function () {
        var payval = $.trim($('#payval').val());
        if (payval == 0) {
            reloadPaySummaryData();
        }
    }
    var reloadPaySummaryData = function () {
        var Guid = $.trim($('#Guid').val());
        if (Guid.length <= 0) {
            return;
        }
        common.postAjax('/H5/FeeQuery', { Guid: Guid }, function (data) {
            document.getElementById("payval").value = data.Fee;
        });
    }
    //初始化缴费页面
    var initPrepaidPage = function () {
        //主页
        function submitPrepaid(carReID, payval, PayApiKey) {
            $.showPreloader('数据提交中...');
            common.postAjax('/H5/SubmitPay', { carReID: carReID, payval: payval, PayApiKey: PayApiKey }, function (result) {
                $.hidePreloader();
                if (result.Code == 1) {
                    //$.show('提交成功，正在跳转支付...');
                    location.href = '/pay/index?orderid=' + result.Message;
                    //$.router.load('/pay/?orderid=' + result.Message);
                } else {
                    $.alert(result.Message);
                }

            });
        }

        $('#form-prepaid').on('submit', function () {

            var carReID = $.trim($('#carReID').val());
            var payval = $.trim($('#payval').val());
            var PayApiKey = $.trim($('#PayApiKey').val());
            if (!carReID) {
                $.toast('无进场记录');
                return false;
            }
            if (!payval) {
                $.toast('金额异常');
                return false;
            }

            $.confirm('确认缴费 ' + payval + ' 元？', function () {
                submitPrepaid(carReID, payval, PayApiKey);
            });
            return false;
        });
    };
    var common = {
        postAjax: function (url, data, success) {
            var hs = document.getElementsByName('__RequestVerificationToken');
            if (hs.length > 0) {
                data = data || {};
                data["__RequestVerificationToken"] = hs[0].value;
            }
            $.ajax({
                url: url,
                cache: false,
                type: 'post',
                dataType: 'json',
                data: data,
                success: success
            });
        }
    };

    $(document).on('pageInit', '#page-prepaid', function (e, id, page) {
        initPrepaidPage();
    });
</script>
